<template>
  <a-modal
    :title="title"
    :visible="isShow"
    @ok="handleSubmit"
    :confirmLoading="confirmLoading"
    :maskClosable="false"
    @cancel="handleCancel"
    width="40%"
    :destroyOnClose="true"
  >
    <a-form :form="form">
      <a-form-item
        label="ORACLE字段名："
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 16 }"
      >
        <a-input
          v-decorator="[
            'newFieldName',
            { rules: [{ required: true, message: '请输入ORACLE字段名' }] }
          ]"
          placeholder="请输入ORACLE字段名"
        />
      </a-form-item>
      <a-form-item
        label="ORACLE字段描述："
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 16 }"
      >
        <a-input
          v-decorator="[
            'fieldDescribe',
            { rules: [{ required: true, message: '请输入ORACLE字段描述' }] }
          ]"
          placeholder="请输入ORACLE字段描述"
        />
      </a-form-item>
      <a-form-item
        label="ORACLE字段类型："
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 16 }"
      >
        <a-input
          v-decorator="[
            'fieldType',
            { rules: [{ required: true, message: '请输入ORACLE字段类型' }] }
          ]"
          placeholder="请输入ORACLE字段类型"
          :disabled="isEdit"
        />
      </a-form-item>
      <a-form-item
        label="ORACLE字段长度："
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 16 }"
      >
        <a-input
          v-decorator="[
            'fieldLength',
            { rules: [{ required: true, message: '请输入ORACLE字段长度' }] }
          ]"
          placeholder="请输入ORACLE字段长度"
        />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
import { page } from "@/api";
export default {
  data() {
    return {
      form: this.$form.createForm(this),
      confirmLoading: false,
      isShow: false,
      title: "编辑字段",
      isEdit: true,
      tName: "",
      fieldName: ""
    };
  },
  mounted() {},
  methods: {
    show(tName, record) {
      // debugger;
      this.tName = tName;
      this.fieldName = record.fieldName;
      confirmLoading: false;
      this.isShow = true;
      setTimeout(() => {
        // debugger
        this.form.setFieldsValue({
          newFieldName: record.fieldName,
          fieldDescribe: record.fieldDescribe,
          fieldType: record.fieldType,
          fieldLength: record.fieldLength
        });
      });
    },
    handleCancel() {
      this.isShow = false;
    },
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
          this.confirmLoading = true;
          //更新
          let params = Object.assign(values, {
            tableName: this.tName,
            oldFieldName: this.fieldName
          });
          if (values.newFieldName === this.fieldName) {
            values.newFieldName = "";
          }
          // debugger
          page
            .updateTableStructure(values)
            .then(res => {
              if (res.data.code === -1) {
                this.$message.warning(res.data.message);
              } else {
                this.isShow = false;
                this.$emit("addSuccess");
                this.$message.success("编辑表成功");
              }
              this.confirmLoading = false;
            })
            .catch(() => {
              this.isShow = false;
              this.confirmLoading = false;
              this.$message.warning("编辑表失败");
            });
        }
      });
    }
  }
};
</script>
<style scoped></style>
